import React,{PureComponent} from 'react'
import {View,Button,SafeAreaView,Text,StyleSheet,TextInput,ScrollView,Dimensions,TouchableOpacity,Image} from 'react-native'
import color from "../../../widget/color";
import {StackNavigator, TabNavigator, TabBarTop} from "react-navigation";
import ScrollableTabView, {DefaultTabBar, ScrollableTabBar} from "react-native-scrollable-tab-view";

import MineUnPayOrderScene from "./MineUnPayOrderScene";
import MinePayOrderScene from "./MinePayOrderScene";
// import MineCancelOrderScene from "./MineCancelOrderScene";
import MineRefuesOrderScene from "./MineRefuesOrderScene";
import MineAllOrderScene from "./MineAllOrderScene";
import MineOrderTabBar from '../../../widget/mine/MineOrderTabBar'

const {width} = Dimensions.get('window')

type Props = {
    navigation:any,
}
const tabTitles = ['全部订单', '未付款', '已付款','退款单'];

export default class MineOrderScene extends PureComponent<Props>{
    static navigationOptions = ({navigation}: any) => ({
        headerTintColor:'white',
        headerStyle:{
            backgroundColor:color.globalMainColor
        },
        title:'我的订单',
        headerRight:<Text/>,
        headerLeft:<TouchableOpacity onPress={()=>{
            navigation.goBack()
        }}>
            <Image style={{marginLeft:12}} source={require('../../../../res/img/video/back.png')}/>
        </TouchableOpacity>
    });
    constructor(props){
        super(props)
    }

    render(){
        const {number} = this.props.navigation.state.params
        return (
            <ScrollableTabView
                tabBarUnderlineStyle={styles.lineStyle}
                renderTabBar={() =>
                    <MineOrderTabBar
                        tabNames={tabTitles}
                    />}
                tabBarPosition='top'
                initialPage={number}
            >
                <MineAllOrderScene {...this.props}/>
                <MineUnPayOrderScene {...this.props}/>
                <MinePayOrderScene {...this.props}/>
                <MineRefuesOrderScene {...this.props}/>
            </ScrollableTabView>
        )
    }
}
const styles = StyleSheet.create({
    lineStyle: {
        height: 0,
    },
})
